﻿import QtQuick 2.0
import QtQuick.Controls 2.2

import "../../js/util.js" as Util
import "../../js/UI.js" as Style
import "../common"

Page{
    id: m_mainView_id
    property Component component: null
    readonly property var m_barTextArray2: getModel()
    function getModel(){
        return [
                    {iconName:qsTr("课程"),isActive:true,
                        icon:{active:"qrc:/image/kecheng1.png",deactive:"qrc:/image/kecheng2.png"},
                        url:"qrc:/qml/form/Curriculum.qml"},
                    {iconName:qsTr("地图"),isActive: true,
                        icon:{active:"qrc:/image/ditu2.png",deactive:"qrc:/image/ditu1.png"},
                        url:"qrc:/qml/form/MapPage.qml"},
                    {iconName:qsTr("学院"),isActive:true,
                        icon:{active:"qrc:/image/xueyuan2.png",deactive:"qrc:/image/xueyuan1.png"},
                        url:"qrc:/qml/form/CollegePage.qml"},
                    {iconName:qsTr("我的"),isActive: true,
                        icon:{active:"qrc:/image/wode2.png",deactive:"qrc:/image/wode1.png"},
                        url:"qrc:/qml/form/PersonPage.qml"}
                ]
    }
    readonly property int m_pageCount:{
        var count = 0
        for(var i = 0; i < m_barTextArray2.length; i++){
            if(m_barTextArray2[i].isActive)
                count++
        }
        console.log("m_pageCount:"+count);
        return count
    }
    property int moreuse: 0
    default property int m_currentIndex: 0

    Component.onCompleted: {
        m_Loader_id.source = "qrc:/qml/form/Curriculum.qml"
    }

    Rectangle{
        id: mesg
        width: m_mainView_id.width
        height: m_lineValue
        color: "#fafafa"
        anchors.bottom: parent.bottom
        SplitLine{
            anchors.top: parent.top
            width: parent.width
        }
        ListView{
            id: safka
            height: mesg.height
            width: parent.width
            anchors.verticalCenter: mesg.verticalCenter
            anchors.left: parent.left
            anchors.right: parent.right
            orientation: ListView.Horizontal
            interactive: false
            model: m_barTextArray2
            delegate: Item{
                width: modelData.isActive ? (m_mainView_id.width / m_pageCount) : 0
                height: mesg.height
                ButtonBar{
                    anchors.centerIn: parent
                    width: height
                    height: parent.height
                    m_text: modelData.iconName
                    m_source: isActive(index)?modelData.icon.active : modelData.icon.deactive
                    m_color: getColor(index)
                    onClickSignal: {
                        clickedSlot(index)
                    }
                }
            }
        }
    }
    Loader{
        id: m_Loader_id
        anchors.top: parent.top
        anchors.bottom: mesg.top
        width: m_mainView_id.width
    }

    function getColor(index) {
        return isActive(index)? "#1179DA" : "#666666"
    }
    function isActive(index) {
        return m_currentIndex === index && moreuse === index
    }
    function clickedSlot(index) {
        if (m_currentIndex === index&&moreuse === index) {
            return
        }else{
            moreuse = index
            m_currentIndex = index
        }
        m_Loader_id.source =m_barTextArray2[m_currentIndex].url
    }
}
